<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/src/css/layui.css}">
</head>
<body>

    <table id="orders" lay-filter="test"></table>

<script type="text/html" id="barEdit">
    {{# if(d.orders.status === 'waitDelivery'){ }}
    <a class="layui-btn layui-btn-xs layui-btn-disabled" shiro:lacksPermission="order:good:send">发货</a>
    <a class="layui-btn layui-btn-xs" lay-event="send" shiro:hasPermission="order:good:send">发货</a>
    {{# }else{ }}
    <a class="layui-btn layui-btn-xs layui-btn-disabled">发货</a>
    {{# } }}
</script>

    <script th:src="@{/src/layui.js}"></script>
    <script>
        //layui基于组件(模块)开发的     ctrl+shift+f9  工具中重构代码
        layui.use(['table','laydate','jquery','layer'],function () {
            var table = layui.table;
            var laydate = layui.laydate;
            var $ = layui.jquery;
            var layer = layui.layer;
            table.render({
                elem:'#orders',
                url:'/order/list',
                page:true,
                limit:5,
                limits:[5,10,15],
                cols:[
                    [
                        {field:'goods.goodsName',title:'拍品名字',templet:'<div>{{d.goods.goodsName}}</div>'},
                        {field:'user.username',title:'买者姓名',templet:'<div>{{d.user.username}}</div>'},
                        {field:'orders.createdate',title:'下单日期',templet:'<div>{{d.orders.createdate}}</div>'},
                        {field:'orders.paydate',title:'付款日期',templet:'<div>{{d.orders.paydate}}</div>'},
                        {field:'orders.deliverydate',title:'发货日期',templet:'<div>{{d.orders.deliverydate}}</div>'},
                        {field:'orders.confirmdate',title:'完成日期',templet:'<div>{{d.orders.confirmdate}}</div>'},
                        {field:'orders.usermessage',title:'买家留言',templet:'<div>{{d.orders.usermessage}}</div>'},
                        {field:'orders.receiver',title:'收件人',templet:'<div>{{d.orders.receiver}}</div>'},
                        {field:'orders.post',title:'邮编',templet:'<div>{{d.orders.post}}</div>'},
                        {field:'orders.address',title:'地址',templet:'<div>{{d.orders.address}}</div>'},
                        {title:'操作',width:200,templet:'#barEdit'}
                    ]
                ],
                parseData:function (res) {
                    return {
                        "code":res.code==200?0:res.code,
                        "msg":res.message,
                        "count":res.data.total,
                        "data":res.data.list
                    }
                }
            })

            //日期控件
            var start = laydate.render({
                elem:'#begin',
                max:'new Date()',
                done:function (value,date) {
                    end.config.min = date
                    end.config.min.month = date.month-1;  //js  ==> var d  =new Date(); alert( d.getMonth()); 0-11
                }
            });

            var end = laydate.render({
                elem:'#end',
                max: 'new Date()',
                done:function (value,date) {
                    start.config.max = date;
                    start.config.max.month = date.month-1;
                }
            })



            
            table.on('tool(test)',function (obj) {
                var data = obj.data;//行数据
                var event = obj.event;
                if(event === 'send'){
                    layer.confirm('确认发货？',function (index) {
                        $.ajax({
                            url:'/order/updOrder',
                            type:'post',
                            data:data.orders,
                            dataType:'json',
                            success:function (res) {
                                if(res.code == 200){
                                    layer.msg('发货成功',{icon:1},function () {
                                        location.reload();
                                    })
                                }else{
                                    layer.msg('发货失败',{icon:5})
                                }
                            }
                        })
                    })
                }
            })

        })
    </script>


    <script type="text/html" id="statusTel">
        {{# if(d.status === '0'){ }}
            <span>未激活</span>
        {{# }else if(d.status==='1'){ }}
            <span>正常</span>
        {{# }else{ }}
            <span>禁用</span>
        {{# } }}
    </script>

</body>
</html>